<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>

<div id="admin-infoModel" class="modal fade" data-backdrop='static' data-keyboard='true'>
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <!--标题区域-->
                    <h4 class="modal-title">
                        个人资料
                        <button class="close" data-dismiss="modal">
                            <span style="font-size: 23px;">&times;</span>
                        </button>
                    </h4>

                </div>

                <div class="modal-body" style="color: #666;padding-bottom: 0;">
                    <div class='well'>
                        <p>
                        	编号：<span id="admin-id"></span>
                        </p>
                        <p>
	                       	账号：<span id="admin-userAcount"></span>
	                       
                        </p>
                        <p>
	                       	昵称：<span id="admin-name"></span>
                        </p>
                         
                    </div>
                    <div class="edit-box">
                    	 <span class="edit-admin" data-toggle="collapse" data-target="#update-admin-form">
	                         <i class="icon-edit"></i>
	                         	修改资料
	                     </span>
	                     <p class='edit-icon'>
	                     	<span class="glyphicon glyphicon-chevron-down"></span>
	                     </p>
                    </div>
                    
                    <div class="alert alert-danger fade hide" id="alert-adminUpdate">
						<button class="close close-alert-admin">
							<span>&times;</span>
						</button>
						<p class="alert-admin-UpdateTip"></p>
					</div>
					
                	<form id='update-admin-form' 
                		method="POST" class='form-group collapse' onsubmit="return checkUpdate(this);">
                		<input type='hidden' id='update-admin-id' name='id' class='input-controll'/>
                		<div id="update-pwd-box">
                			<div class='input-group input-admin-group'>
	                			<span class="input-group-addon input-admin-group-span" style="padding-right: 25px;">
	                				昵称
	                			</span>
	                			<input id="customerName-input" type='text' name='customerName' class='input-controll input-admin-group-input' placeholder=""/>
	                		</div>
	                		
	                		<div class='input-group input-admin-group'>
	                			<span class="input-group-addon input-admin-group-span">
	                				旧密码
	                			</span>
	                			<input type='password' name='old_pwd' class='input-controll input-admin-group-input'/>
	                		</div>
	                		<div class='input-group input-admin-group'>
	                			<span class="input-group-addon input-admin-group-span">
	                				新密码
	                			</span>
	                			<input type='password' name='new_pwd' class='input-controll input-admin-group-input'/>
	                		</div>
                		</div>
                		 <!--注脚区域-->
                		 <div class='modal-footer'>
                		 	<button type="button" disabled id='edit-post-admin' class="btn btn-success btn-sm pull-right" 
                    			style="border: none;cursor: no-drop;background-color: rgba(92, 184, 92, 55);" onclick='checkUpdate()'> 
                    		修改资料
                    		</button>
                		 </div>
                	</form>
                </div>
            </div>
        </div>
    </div>
    <script>
	    jQuery(".close-alert-admin").on("click",function (){
	    	jQuery("#alert-adminUpdate").alert("close")
	    })
	    
	   	jQuery("#customerName-input").keyup(function(){
	        var len = jQuery(this).val().length
	        if(len >= 10){
				jQuery('#alert-adminUpdate').removeClass('alert-danger').addClass('alert-warning')
				jQuery('#alert-adminUpdate').removeClass('hide').addClass('in')
				jQuery('.alert-admin-UpdateTip').text('用户名最大长度为10！！！')
	            jQuery(this).val(jQuery(this).val().substring(0,10))
	            jQuery("#customerName-input").text(0)
	        }
	    })

	    
	    function checkUpdate(){
	    	if(document.querySelector('#update-admin-form').customerName.value == '' || 
	    				document.querySelector('#update-admin-form').old_pwd.value == '' || document.querySelector('#update-admin-form').new_pwd.value == ''){
	    		jQuery('#alert-adminUpdate').removeClass('hide').addClass('in')
	    		jQuery('.alert-admin-UpdateTip').text('昵称、密码不可为空！！！')
	    	} else {
	    		jQuery.ajax({
	                method: 'POST',
	                url: '/TeachingTest/AdminUpdate',
	             	data: jQuery('#update-admin-form').serialize(),
	             	dataType : "text",
	             	error : function (error){
	             		console.log(error)
	             	},
	             	success : function (res){
	             		 res = JSON.parse(res)
	             		 console.log(res)
	                     if (res.status != '200') {
	                    	 jQuery('#alert-adminUpdate').removeClass('hide').addClass('in')
	         	    		 jQuery('.alert-admin-UpdateTip').text(res.infoMsg)
	                     }else {
	                    	 jQuery('#alert-adminUpdate').removeClass('alert-danger').addClass('alert-success')
	                    	 jQuery('#alert-adminUpdate').removeClass('hide').addClass('in')
	          	    		 jQuery('.alert-admin-UpdateTip').text(res.infoMsg)
	                     }
	             	}
		    	})
	    	}
	    	
	    }
    </script>